---
import { getEntry, type CollectionEntry } from 'astro:content';
import { ModuleMappings } from './ModuleMappings';
import { getFrameworkFromPath } from '@components/docs/utils/urlPaths';
import styles from './ModuleMappings.module.scss';

const { pathname } = Astro.url;
const framework = getFrameworkFromPath(pathname);

const { data: modules } = (await getEntry('moduleMappings', 'modules')) as CollectionEntry<'moduleMappings'>;
---

<div class={styles.container}>
    <ModuleMappings client:only="react" framework={framework} modules={modules} />
</div>
